<template>
    <div class="pagination">
        <el-pagination v-model="props.page.pageNum" background :total="props.page.total" layout="prev, pager, next"
            @current-change="change" />
    </div>
</template>

<script setup lang='ts'>
import { PropType } from 'vue'
import { Page } from "@/interface/common"

const props = defineProps({
    page: {
        type: Object as PropType<Page>,
        required: true
    }
})
const emit = defineEmits(["changeSize"])
const change = (num: number) => {
    console.log("页码变化", num)
    emit("changeSize", num)
}
</script>
<style lang='scss' scoped>
:deep(.el-pagination) {
    width: 100% !important;
    display: flex;
    justify-content: right;
    padding: 10px;
}
</style>